/*
 * File: jquery.dialog.js
 * Desc: Plugin hiển thị dialog, sử dụng jQuery
 * Usage: jQuery.dialog(settings) để mở dialog, với các settings như sau:
 *  + content: nội dung của dialog
 *  + title: nội dung của tiêu đề
 *  + fadeIn, fadeOut: thời gian hiệu ứng hiện và ẩn dialog, tính bằng ms
 *  + loading: true/false có hiện thanh loading hay không
 *  + timeout: khoảng thời gian dialog tự đóng (tính bằng ms), = 0 nếu tắt tính năng này
 */
(function ($) {
    "use strict";
    $.Dialog = (function () {
        var public_methods = {},
            $elements = {},
            timer = null,
            configs = {};

        function center() {
            var $w = $elements.wrapper,
                pTop = Math.max(0, $(window).height() - $w.outerHeight()) / 2,
                pLeft = Math.max(0, $(window).width() - $w.outerWidth()) / 2;
            $w.css({ top: pTop, left: pLeft});
        }

        // Khởi tạo các phần tử của dialog
        if ($('#overlay-dialog').length === 0) {
            $elements = {
                overlay: $('<div class="dialog-overlay"></div>'),
                wrapper: $('<div class="dialog-wrapper"></div>'),
                header: $('<div class="dialog-header"></div>'),
                title: $('<div class="dialog-title"></div>'),
                close: $('<div class="dialog-close"></div>'),
                body: $('<div class="dialog-body"></div>'),
                loading: $('<div class="dialog-loading"></div>'),
                content: $('<div class="dialog-content"></div>'),
                footer: $('<div class="dialog-footer"></div>'),
                confirm: $('<button class="dialog-confirm"></button>'),
                cancel: $('<button class="dialog-cancel"></button>')
            };


            $elements.overlay.attr('id', 'overlay-dialog').hide();
            $elements.wrapper.hide().append(
                $elements.header.append($elements.title, $elements.close.text('x')),
                $elements.body.append(
                    $elements.loading,
                    $elements.content
                ),
                $elements.footer.append(
                    $elements.cancel,
                    $elements.confirm
                )
            );

            $(document).ready(function () {
                $('body').append($elements.overlay, $elements.wrapper);
                center();
            });
        }

        // Kiểm tra xem dialog có đang hiển thị không
        function showing() {
            return $elements.wrapper.css('display') !== 'none';
        }

        public_methods.show = function (settings) {
            configs = $.extend({}, $.Dialog.settings, settings);
            if (settings.text) {
                configs.content = settings.text;
            }

            // Đặt nội dung vào dialog
            $elements.content.empty().append(configs.content)
                .removeClass('error warning info').addClass(configs.type);
            $elements.title.empty().text(configs.title);


            if (configs.confirm) {
                $elements.confirm.text(configs.confirm_text).show();
            } else {
                $elements.confirm.hide();
            }

            if (configs.loading) {
                $elements.loading
                    .show()
                    .children('img').attr('src', configs.loading_url);
            } else {
                $elements.loading.hide();
            }

            if (configs.cancel) {
                $elements.close.show();
                $elements.cancel.
                    text(configs.cancel_text).show();
            } else {
                $elements.close.hide();
                $elements.cancel.hide();
            }

            $elements.wrapper.fadeIn(configs.fadeIn);
            $elements.overlay.fadeIn(configs.fadeIn);

            center();
            $(window).on('resize', center);

            if (configs.timeout) {
                timer = setTimeout($.Dialog.close, configs.timeout);
            }
        };

        function close() {
            if (showing()) {
                $elements.wrapper.animate({top: "-100px"}, configs.fadeOut);
                $elements.overlay.fadeOut(configs.fadeOut, function () {
                    $elements.wrapper.hide();
                    $(window).off('resize');
                });

                configs.on_close();

            } else {
                if ($elements.overlay.css("display") !== "none") {
                    $elements.overlay.hide();
                }
            }
            if (timer) {
                clearTimeout(timer);
                timer = null;
            }
        }

        public_methods.hide_loading = function () {
            $elements.loading.fadeOut(200);
        };
        // Đóng dialog
        public_methods.close = function (fadeTime) {
            if (fadeTime !== undefined) {
                configs.fadeOut = fadeTime;
            }

            close();
        };

        $elements.close.click(close);

        $elements.confirm.click(function () {
            close();
            configs.on_confirm();
        });


        $elements.cancel.click(function () {
            close();
            configs.on_cancel();
        });

        return public_methods;

    }());

    // Các cấu hình mặc định
    $.Dialog.settings = {
        fadeIn: 200, // thời gian hiển thị dialog
        fadeOut: 300, // thời gian ẩn dialog
        content: 'Hello world',
        title: 'Nhatroct - Tìm kiếm nhà trọ miễn phí',
        type: 'info',
        close: true,
        loading: false, // hiển thị thanh loading không
        timeout: 0, // khoảng thời gian tự đóng, disable nếu = 0
        confirm: false, // Hiển thị nút đồng ý
        cancel: true, // hiển thị nút đóng/cancel,
        confirm_text: 'Đồng ý',
        cancel_text: 'Đóng',

        on_close: function () {
        }, // sự kiện khi đóng dialog
        on_confirm: function () {
        }, // sự kiện khi nhấn nút confirm
        on_cancel: function () {
        } // sự kiện khi nhấn nút cancel
    };
}(window.jQuery));